<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="./css/styles.css" />
<script type="text/javascript"
	src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCilAVnzNc8kx7zXMY1JaT82j6pby588BE&sensor=true">
</script>
<script type="text/javascript"
	src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="./scripts/base.js">
</script>
</head>
<body onload="initialize()">
	<div id="main_container">
		<header>
			<h1>TrippWeather</h1>
		</header>
		<nav></nav>
		<aside id="leftPane">
			<p>
				Start at: <input type="text" id=startPoint value="minneapolis">
			</p>
			<p>
				End at: <input type="text" id=endPoint value="chicago">
			</p>
			<p>
				<button type="button" onClick="javascript:getDirections();">Show
					Weather</button>
		</aside>
		<article id="summaryPane">
			<div id="locations">
			<table id="locationsTable">
			<tr><th>City</th><th>Temperature</th><th>Conditions</th></tr>			
			</table>
			</diV>
		</article>
		<article id="mapPane">
			<div id="map_canvas"></div>
		</article>
	</div>
</body>
</html>